<div class="full-width container has-tooltip">
  @if (label() || tooltip()) {
    <ix-label
      [label]="label()"
      [tooltip]="tooltip()"
      [required]="required()"
      [ixTestOverride]="controlDirective.name || ''"
    ></ix-label>
  }

  <div
    class="input-container"
    [class.disabled]="disabledState$ | async"
  >
    <div #inputArea></div>
  </div>

  @let control = controlDirective.control;
  @if (control) {
    <ix-errors [control]="control" [label]="label()"></ix-errors>
  }

  @if (hint()) {
    <mat-hint>{{ hint() }}</mat-hint>
  }
</div>


